<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title th:text="'你好'">Insert title here</title>

<link th:href="@{/css/modern.css}" rel="stylesheet"/>
<link th:href="@{/css/modern-responsive.css}" rel="stylesheet"/>
<link th:href="@{/css/jquery.dataTables.css}" rel="stylesheet"/>
<link th:href="@{/css/base.css}" rel="stylesheet"/>
<script type="text/javascript" th:src="@{/js/jquery.js}"></script>
<script type="text/javascript" th:src="@{/js/jquery.dataTables.min.js}"></script>
<script type="text/javascript" th:src="@{/js/jquery.mousewheel.js}"></script>
<script type="text/javascript" th:src="@{/js/dropdown.js}"></script>
<script type="text/javascript" th:src="@{/js/input-control.js}"></script>
<script type="text/javascript" th:src="@{/js/tile-slider.js}"></script>
<script type="text/javascript" th:src="@{/js/dialog.js}"></script>
<script type="text/javascript" th:src="@{/js/base.js}"></script>
<script type="text/javascript" th:inline="javascript">
/*<![CDATA[*/
var password_null_tip = /*[[#{password_null_tip}]]*/'mi吗不能未空',
old_password_null_tip = /*[[#{old_password_null_tip}]]*/'就密码不能未空',
modify_success_tip = /*[[#{modify_success_tip}]]*/'modify_success_tipaaaaa',
unexcepted_error_tip = /*[[#{unexcepted_error_tip}]]*/'就unexcepted_error_tip',
confirm_password_null_tip = /*[[#{confirm_password_null_tip}]]*/'确认密码不能我i额空',
password_inconsistent_tip = /*[[#{password_inconsistent_tip}]]*/'确认密码与密码不一致',
bankName_null_tip = /*[[#{bankName_null_tip}]]*/'确认密码与密码不一致',
bankNo_null_tip = /*[[#{bankNo_null_tip}]]*/'确认密码与密码不一致',
bank_username_null_tip = /*[[#{bank_username_null_tip}]]*/'确认密码与密码不一致',
password_similar_tip = /*[[#{password_similar_tip}]]*/'密码不能喝哟个户名一直';

$(function(){
	$('.tile').click(function(){
		var targetId = $(this).attr('target-id');
		if(!targetId){
			return;
		}
		var target = $('#' + targetId);
		if(!target){
			return;
		}
		$('.notices').slideUp();
		$('.tile').removeClass('selected');
		$(this).addClass('selected');
		$('*:animated').stop(true, true);
		
		$('fieldset:visible').slideUp(500, function(){
			target.slideDown(500);
		});
	});
	
	
	$('#btn-uif').click(function(){
		var password = $('#uif-password').val();
		if (password == '') {
			$('#msg-text').html(password_null_tip).parent().parent().slideDown(500);
			return;
		}
		$.ajax({
			url: /*[[@{/i/myInfo}]]*/'./i/myInfo'
			, type: 'POST'
			, data: {
					username: $('#username').val()
					, password: password
					, firstName: $('#firstName').val()
					, lastName: $('#lastName').val()
					, email: $('#email').val()
					, mobile: $('#mobile').val()
				}
			, dataType: 'json'
			, error: function(jqXHR, textStatus, errorThrown){
				alert(unexcepted_error_tip);
			}
			, success: function(data, textStatus, jqXHR){
				if(data && data.result == 1){
					alert(modify_success_tip);
					return;
				}
				$('#msg-text').html(login_failed_tip + data.result).parent().parent().slideDown(500);
			}
		});
	});
	
	$('#btn-bif').click(function(){
		var password = $('#bif-password').val();
		if (password == '') {
			$('#msg-text').html(password_null_tip).parent().parent().slideDown(500);
			return;
		}
		var bankName = $('#bankName').val();
		if (bankName == '') {
			$('#msg-text').html(bankName_null_tip).parent().parent().slideDown(500);
			return;
		}
		var bankNo = $('#bankNo').val();
		if (bankNo == '') {
			$('#msg-text').html(bankNo_null_tip).parent().parent().slideDown(500);
			return;
		}
		var name = $('#name').val();
		if (name == '') {
			$('#msg-text').html(bank_username_null_tip).parent().parent().slideDown(500);
			return;
		}
		$.ajax({
			url: /*[[@{/i/bankInfo}]]*/'./i/bankInfo'
			, type: 'POST'
			, data: {
					bankName: bankName
					, bankNo: bankNo
					, name: name
					, password: password
				}
			, dataType: 'json'
			, error: function(jqXHR, textStatus, errorThrown){
				alert(unexcepted_error_tip);
			}
			, success: function(data, textStatus, jqXHR){
				if(data && data.result == 1){
					alert(modify_success_tip);
					return;
				}
				$('#msg-text').html(login_failed_tip + data.result).parent().parent().slideDown(500);
			}
		});
	});
	
	$('#btn-pif').click(function(){
		var op = $('#old-password').val();
		var password = $('#password').val();
		var confirmPassword = $('#confirm-password').val();
		if (op == ''){
			$('#msg-text').html(old_password_null_tip).parent().parent().slideDown(500);
			return;
		}
		if(password == '') {
			$('#msg-text').html(password_null_tip).parent().parent().slideDown(500);
			return;
		}
		if (new RegExp(username).test(password)) {
			$('#msg-text').html(password_similar_tip).parent().parent().slideDown(500);
			return;
		}
		if (confirmPassword == '') {
			$('#msg-text').html(confirm_password_null_tip).parent().parent().slideDown(500);
			return;
		}
		if (confirmPassword != password) {
			$('#msg-text').html(password_inconsistent_tip).parent().parent().slideDown(500);
			return;
		}
		$.ajax({
			url: /*[[@{/i/updatePassword}]]*/'./i/updatePassword'
			, type: 'POST'
			, data: {
					oldPassword: op
					, newPassword: password
					, confirmPassword: confirmPassword
				}
			, dataType: 'json'
			, error: function(jqXHR, textStatus, errorThrown){
				alert(unexcepted_error_tip);
			}
			, success: function(data, textStatus, jqXHR){
				if(data && data.result == 1){
					alert(modify_success_tip);
					return;
				}
				$('#msg-text').html(login_failed_tip + data.result).parent().parent().slideDown(500);
			}
		});
	});
	
	

	$.fn.dataTableExt.oStdClasses.sPaging = 'pagination place-right ';
	$.fn.dataTableExt.oStdClasses.sPageButtonStaticDisabled = '';
	$.fn.dataTableExt.oStdClasses.sPageFirst = 'first';
	$.fn.dataTableExt.oStdClasses.sPagePrevious = 'prev';
	$.fn.dataTableExt.oStdClasses.sPageNext = 'next';
	$.fn.dataTableExt.oStdClasses.sPageLast = 'last';
	$.fn.dataTableExt.oStdClasses.sPageButtonActive = 'active';
	var datatable = $('#datatable').dataTable({
		sAjaxSource: /*[[@{/i/references}]]*/'i/references'
		, sDom: '<rltip>'
		, sPaginationType: 'full_numbers'
		, sServerMethod: 'POST'
		, bServerSide: true
		, aoColumns: [
				{mData: 'username', sTitle: '用户名', bSortable: false}
				, {mData: 'registerTime', sTitle: '注册时间', bSortable: false, mRender: function(data, type, full){
					var d = new Date(data);
					return d.toLocaleString();
				}}
          ]
		, fnServerParams: function ( aoData ) {
			aoData.push(
					{name: 'username', value: $('#ref-username').val()}
					);
		}
		, oLanguage: {
			oPaginate: {
				sFirst: ''
				, sLast: ''
				, sNext: ''
				, sPrevious: ''
			}
			, sEmptyTable: '无数据'
			, sInfo: '共计_TOTAL_数据, 显示_START_到_END_'
			, sInfoEmpty: '无数据可显示'
			, sLengthMenu: '每页_MENU_条数据'
		}
	});
	
	
	$('#search-ref').click(function(){
		datatable.fnPageChange(0);
	});
	
	$('#verify-email').click(function(){
		alert(1);
	})
	$('#verify-mobile').click(function(){
		alert(1);
	})
	//alert(document.domain);
	$('#reference-link').val('http://' + window.location.host + $('#reference-link').val()).click(function(){
		$(this).select();
	});
	$('#btn-withdraw').click(function(){
		$.ajax({
			url: /*[[@{/i/canWithDraw}]]*/'i/canWithDraw'
			, type: 'GET'
			, dataType: 'json'
			, success: function(data){
				if(data > 10){
					$.Dialog({
						title: '提现申请: 请输入要体现的金额'
						, content: '<input type="number" id="dialog-withdraw" value="'+data+'"/>' + '提现会扣除0.5%的手续费，2个工作日内完成'
						, draggable: true
						, overlay: true
						, closeButton: true
						, buttonsAlign: 'right'
						, buttons: {
							'确定': {
								action: function(){
									var m = $('#dialog-withdraw').val();
									if(isNaN(m)){
										alert('必须输入数字');
										return;
									}
									if(m <= 10){
										alert('提现金额必须大于$10');
										return;
									}
									if(confirm('您确定要提现: $' + m)){
										$.ajax({
											url: /*[[@{/i/withDraw}]]*/'i/withDraw'
											, type: 'POST'
											, dataType: 'json'
											, data: {
												withDraw: m
											}
											, success: function(data){
												
											}
										});
									}
								}
							}
							, '取消': {
								action: function(){
									
								}
							}
						}
					});
				}
			}
			, error: function(data){
				alert('error');
			}
		});
	});
});
/*]]>*/
</script>
</head>
<body>
<header th:substituteby="common/template::header">
</header>
<div class="span12 align-center">
	<div class="grid">
		<div class="row">
			<div class="span7">
				<div class="row">
					<div class="notices no-display">
				        <div class="bg-color-red">
				            <a href="#" class="close"></a>
				            <div class="notice-icon"> <i class="icon-locked-2" style="color: white;"></i> </div>
				            <div class="notice-image"> <i class="icon-warning" style="font-size: 48pt; color: white;"></i> </div>
				            <div id="msg-header" class="notice-header fg-color-yellow" th:text="#{update_failed}">修改失败</div>
				            <div id="msg-text" class="notice-text"></div>
				        </div>
				    </div>
				</div>
				<fieldset id="user-info">
					<div class="grid">
						<div class="row">
							<label for="username" class="span2 text-right" th:text="#{username}">用户名</label>
							<div class="input-control text span3">
						        <input type="text" id="username" th:value="${session.session_user.username}" disabled="disabled" class="disabled"/>
						        <button class="helper"></button>
						    </div>
						</div>
						<div class="row">
							<label for="firstName" class="span2 text-right" th:text="#{firstName}">用户名</label>
							<div class="input-control text span3">
						        <input type="text" id="firstName" th:value="${session.session_user.firstName}" />
						        <button class="helper"></button>
						    </div>
						    <div id="firstName_tip" class="span2 no-display fg-color-red">
						    </div>
						</div>
						<div class="row">
							<label for="lastName" class="span2 text-right" th:text="#{lastName}">用户名</label>
							<div class="input-control text span3">
						        <input type="text" id="lastName" th:value="${session.session_user.lastName}" />
						        <button class="helper"></button>
						    </div>
						    <div id="lastName_tip" class="span2 no-display fg-color-red">
						    </div>
						</div>
						<div class="row">
							<label for="email" class="span2 text-right" th:text="#{email}">用户名</label>
							<div class="input-control text span3">
						        <input type="text" id="email" th:value="${session.session_user.email}" />
						        <button class="helper"></button>
						    </div>
						    <div id="email_tip" class="span2 no-display fg-color-red">
						    </div>
						</div>
						<div class="row">
							<label for="mobile" class="span2 text-right" th:text="#{mobile}">用户名</label>
							<div class="input-control text span3">
						        <input type="text" id="mobile" th:value="${session.session_user.mobile}" />
						        <button class="helper"></button>
						    </div>
						    <div id="mobile_tip" class="span2 no-display fg-color-red">
						    </div>
						</div>
						<div class="row">
							<label for="uif-password" class="span2 text-right" th:text="#{password}">用户名</label>
							<div class="input-control text span3">
						        <input type="text" id="uif-password" />
						        <button class="helper"></button>
						    </div>
						</div>
					</div>
					<div class="row">
						<button id="btn-uif" class="big offset2 span3 bg-color-green fg-color-white" th:text="#{info_modify}"> 立 即 登 录 </button>
					</div>
				</fieldset>
				<fieldset id="bank-info" class="no-display">
					<div class="grid">
						<div class="row">
							<label for="bankName" class="span2 text-right" th:text="#{bankName}">开户行名称</label>
							<div class="input-control text span3">
						        <input disabled="disabled" class="disabled" type="text" id="bankName" th:value="${session.session_user.bank}?(${session.session_user.bank.bankName}?${session.session_user.bank.bankName}:'Liberty Reserve'):'Liberty Reserve'" />
						        <button class="helper"></button>
						    </div>
						    <div id="bankName_tip" class="span2 no-display fg-color-red">
						    </div>
						</div>
						<div class="row">
							<label for="bankNo" class="span2 text-right" th:text="#{bankNo}">开户zhanghao</label>
							<div class="input-control text span3">
						        <input type="text" id="bankNo" th:value="${session.session_user.bank}?(${session.session_user.bank.bankNo}?${session.session_user.bank.bankNo})" />
						        <button class="helper"></button>
						    </div>
						    <div id="bankNo_tip" class="span2 no-display fg-color-red">
						    </div>
						</div>
						<div class="row">
							<label for="name" class="span2 text-right" th:text="#{bank.name}">开户ming</label>
							<div class="input-control text span3">
						        <input type="text" id="name" th:value="${session.session_user.bank}?(${session.session_user.bank.name}?${session.session_user.bank.name})" />
						        <button class="helper"></button>
						    </div>
						    <div id="name_tip" class="span2 no-display fg-color-red">
						    </div>
						</div>
						<div class="row">
							<label for="bif-password" class="span2 text-right" th:text="#{password}">用户名</label>
							<div class="input-control text span3">
						        <input type="text" id="bif-password" />
						        <button class="helper"></button>
						    </div>
						</div>
					</div>
					<div class="row">
						<button id="btn-bif" class="big offset2 span3 bg-color-yellow fg-color-white" th:text="#{info_modify}"> 立 即 登 录 </button>
					</div>
				</fieldset>
				<fieldset id="password-update" class="no-display">
					<div class="grid">
						<div class="row">
							<label for="old-password" class="span2 text-right" th:text="#{old_password}">开户行名称</label>
							<div class="input-control text span3">
						        <input type="text" id="old-password" th:placeholder="#{old_password}"/>
						        <button class="helper"></button>
						    </div>
						    <div id="old-password_tip" class="span2 no-display fg-color-red">
						    </div>
						</div>
						<div class="row">
							<label for="password" class="span2 text-right" th:text="#{password}">开户行名称</label>
							<div class="input-control text span3">
						        <input type="text" id="password" th:placeholder="#{password}"/>
						        <button class="helper"></button>
						    </div>
						    <div id="password_tip" class="span2 no-display fg-color-red">
						    </div>
						</div>
						<div class="row">
							<label for="confirm-password" class="span2 text-right" th:text="#{confirm_password}">开户行名称</label>
							<div class="input-control text span3">
						        <input type="text" id="confirm-password" th:placeholder="#{confirm_password}"/>
						        <button class="helper"></button>
						    </div>
						    <div id="confirm-password_tip" class="span2 no-display fg-color-red">
						    </div>
						</div>
						<div class="row">
							<button id="btn-pif" class="big offset2 span3 bg-color-orange fg-color-white" th:text="#{password_update}"> 立 即 登 录 </button>
						</div>
					</div>
				</fieldset>
				<fieldset id="reference-manage" class="no-display">
					<div class="grid">
						<div class="row">
							<label for="reference-link" class="span2 text-right" th:text="#{reference_link}">您的介绍链接为</label>
							<div class="input-control text span4 disabled">
						        <input type="text" id="reference-link" th:value="@{/(ref=${session.session_user.id})}" readonly="readonly"/>
						    </div>
						</div>
						<div class="row">
							<label for="reference-balance" class="span2 text-right" th:text="#{reference_balance}">可提现金额(介绍奖励累计)</label>
							<div class="input-control text span4 disabled">
								<input type="number" id="reference-balance" th:value="${session.session_user.totalBalance}?${session.session_user.totalBalance}:0" readonly="readonly" />
							</div>
							<button id="btn-withdraw" class="offset1">提现</button>
						</div>
						<div class="row">
							<label for="ref-username" class="span1 text-right" th:text="#{username}">username</label>
							<div class="input-control text span2">
								<input type="text" id="ref-username" />
								<button class="helper"></button>
							</div>
							<button id="search-ref" class="offset1">搜索</button>
						</div>
						<div class="row">
							<table id="datatable"></table>
						</div>
					</div>
				</fieldset>
			</div>
			<div class="span5 padding30">
				<div style="height: 120px;" class="tile double bg-color-red" th:unless="${session.session_user.emailVerified} and ${session.session_user.mobileVerified}">
					<div class="tile-content">
						<h3 id="verify-email"><i class="icon-mail"></i> <span th:text="${#strings.substring(session.session_user.email, 0, 2)} + '***@' + ${#strings.substringAfter(session.session_user.email, '@')}"></span> <i class="icon-cancel-2 icon-checkmark" th:class="${session.session_user.emailVerified}?'icon-checkmark':'icon-cancel-2'"></i></h3>
						<br/>
						<h3 id="verify-mobile"><i class="icon-phone"></i> <span th:text="${#strings.length(session.session_user.mobile) > 7} ? (${#strings.substring(session.session_user.mobile, 0, 3)} + '****' + ${#strings.substring(session.session_user.mobile, 7, #strings.length(session.session_user.mobile))}) : (${#strings.substring(session.session_user.mobile, 0, 2)} + '****')"></span> <i class="icon-cancel-2 icon-checkmark" th:class="${session.session_user.mobileVerified}?'icon-checkmark':'icon-cancel-2'"></i></h3>
					</div>
					<div class="brand">
						<span class="name">账户信息验证</span>
					</div>
				</div>
				<div id="uif" target-id="user-info" class="tile double-vertical bg-color-green selected">
					<div class="tile-content">
						<div style="margin-top: 100px;">
							<i class="icon-user-3" style="font-size: 70pt;margin-left: 8px;"></i>
						</div>
					</div>
					<div class="brand">
						<span class="name">基本信息更新</span>
					</div>
				</div>
				<div id="bif" target-id="bank-info" class="tile bg-color-yellow">
					<div class="tile-content">
						<div style="margin-top: 20px;">
							<i class="icon-credit-card" style="font-size: 70pt;margin-left: 8px;"></i>
						</div>
					</div>
					<div class="brand">
						<span class="name">银行帐号设置</span>
					</div>
				</div>
				<div id="pif" target-id="password-update" class="tile bg-color-orange">
					<div class="tile-content">
						<div style="margin-top: 20px;">
							<i class="icon-github-2" style="font-size: 70pt;margin-left: 8px;"></i>
						</div>
					</div>
					<div class="brand">
						<span class="name">密码修改</span>
					</div>
				</div>
				<div id="rif" target-id="reference-manage" class="tile double bg-color-blue" style="height: 100px;">
					<div class="tile-content">
						<div class="place-left" style="margin-top: 10px;">
							<i class="icon-github" style="font-size: 40pt; margin-left: 4px;"></i>
						</div>
						<div>
							<p style="margin-top:10px;">
								通过您的介绍连接注册的用户即自动成为您的下线，您可以永久享受您的下线佣金的5%作为回报
							</p>
						</div>
					</div>
					<div class="brand">
						<span class="name">下线管理</span>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>
<div th:substituteby="common/template::page-settings" >
</div>
</body>
</html>